{% extends "base.html" %}

{% block title %}JumpLab - Experiment 1{% endblock %}

{% block content %}
		<h2>Jumpstart Laboratory</h2>
		<table width=100% height=100%><tr>
			<td>
				<h3>Experiment 1</h3>
				<p><b>Last Update:</b> 2010-03-22</p>
				<p><b>Purpose:</b> Examine interaction between Google Account Sign-in/Sign-out and Google Friend Connect Sign-in/Sign-out</p>
				<p>This experiment consists of the following elements:</p>
				<ol>
					<li>Google App Engine <a href="http://code.google.com/appengine/docs/python/overview.html">Python Environment</a></li>
					<li>Django <a href="http://code.google.com/appengine/docs/python/gettingstarted/templates.html">Templates</a></li>
					<li><a href="http://code.google.com/appengine/docs/python/users/">GAE Accounts API</a> for Sign-in/Sign-out</li>
					<li>Google Friend Connect <a href="http://code.google.com/apis/friendconnect/js_api.html">JavaScript API</a> for Sign-in/Sign-out</li>
					<li>GFC Sample <a href="http://www.google.com/friendconnect/home/gadgets">Gadget</a></li>
					<li>GFC Ratings <a href="http://www.google.com/friendconnect/home/gadgets">Gadget</a></li>
				</ol>
				<p style="margin-top:2em">Some observations:</p>
				<p><i>These notes relate to the use of a <b>Google Account</b> only (i.e either directly with <b>Accounts API</b> or via <b>Friend Connect</b>).</i></p>
				<ol>
					<li>Sign-in to any Google service (eg. Gmail) does not result in Sign-in for GAE application (neither Google Account API nor Google Friend Connect)</li>
					<ul><li>There is no automatic sign-in feature for GAE applications using Google Account API (in contrast to standard Google services that allow a single sign-on for access to all services)</li></ul>
					<li>Sign-in with Google Account API does not result in Sign-in for Friend Connect, and vice versa</li>
					<li>Sign-in with Google Account API or Google Friend Connect results in Sign-in for all Google services using single sign-on (eg. Gmail, Reader, Blogger, etc.)</li>
					<li>Sign-in with Google Friend Connect creates 2 local site cookies, called "fcauth{site-id}" and "fcauth{site-id}-s"</li>
					<ul><li>{site-id} is the site ID obtained from the <a href="http://www.google.com/friendconnect/">Friend Connect admin site</a></li>
					    <li>the second cookie is set to expire at the end of the session and may be related to one of the gadgets</li>
					</ul>
					<li>Sign-out from any Google service (eg. Gmail, Reader, Blogger, etc.), does not result in Sign-out for this site (neither Google Account API nor Google Friend Connect)</li>
					<li>Sign-out with Google Account API signs out globally on <b>ALL</b> Google services (eg. Gmail, Reader, Blogger, etc.), <b>BUT DOES NOT sign out from Friend Connect</b> (and consequently this site)</li>
					<li>Sign-out with Friend Connect Account only signs out on this site (not other Google services, or other Friend Connected sites)</li>
					<li>Sign-out with Friend Connect Account does not reload page, but the Friend Connect "onload" callback handler is called again</li> 
					<li>It's not-so-nice to work with separate client-side vs server-side code to handle Sign-in/Sign-out (i.e. you need extra code to represent user data on server and client)</li>
					<li>It's annoying to wait for a JavaScript library to become available and needing to work around that</li>
					<li>Pending more thorough investigation, it seems that each invocation of the Friend Connect JS API adds another item in the browser's back-history</li>
					<ul><li>It is confirmed that this happens for Google Chrome 4.1 (3 history items) and Firefox 3.6 (2 history items), but apparently not for Firefox 3.0</li></ul>
					<ul><li>It does not seem to happen on the very first visit to the page in a given browser session</li></ul>
					<li>Client-side JavaScript code can get messy; frameworks like <a href="http://code.google.com/webtoolkit/">GWT</a> might help</li>
				</ol>
				
				{{FConnectRatings}}
				
			</td>
			<td width=300 id="right-bar">
			<div>
			{% if user %}
				<a href="/logout">Sign OUT (Google Account API)</a>
				<p>Currently signed in as:</p>
				<ul>
					<li>Nickname: {{user.nickname}}</li>
					<li>E-mail: {{user.email}}</li>
				</ul>
			{% else %}
				<a href="/login">Sign IN (Google Account API)</a>
			{% endif %}
			</div>
			{% if FConnectLoader %}
			<div id='fc-nocontrols'>
			<div style='height:20px'></div>
			<div style='border: 1px solid black'><i>If you see this text, the Google Friend Connect API has not loaded correctly (yet)</i></div>
			</div>
			<div id='fc-controls' style='display:none'>
				<p>OR</p>
				<div>
					<div><a id='fc-sign-in-out' href="#" onclick='google.friendconnect.requestSignIn()'>Sign IN (Google Friend Connect)</a></div>
					<div style='height:10px'></div>
					<div id='fc-profile' style='display:none'><span id='fc-username'></span> (<a href="#" onclick='google.friendconnect.requestSettings()'>Settings</a>)</div>
				</div>
			</div>
			<script type="text/javascript">
			function showFCControls() {
				document.getElementById('fc-nocontrols').style.display = 'none';
				
				var login = document.getElementById('fc-sign-in-out');
				var profile = document.getElementById('fc-profile');
				var username = document.getElementById('fc-username');
					
				if (fcUser) {
					login.innerHTML = "Sign OUT (Google Friend Connect)";
					login.onclick = function () {google.friendconnect.requestSignOut()};
					username.innerHTML = fcUser;
					profile.style.display = 'block';
				}
				else {
					login.innerHTML = "Sign IN (Google Friend Connect)";
					login.onclick = function () {google.friendconnect.requestSignIn()};
					username.innerHTML = "Anonymous";
					profile.style.display = 'none';
				}
				document.getElementById('fc-controls').style.display = 'block';
			}
			</script> 
			{% endif %}
			<div style="height:50px"></div>
			
			{{FConnectSample}}
			
			</td>
		</tr></table>
		
		{% if FConnectLoader %}
		<script type="text/javascript">
		// initPage is called by FriendConnect "onload" callback handler for user data
		function initPage() {
			// only show Friend Connect controls if Friend Connect data loads correctly
			showFCControls();
		}
		var t=setTimeout("initPage();", 4000); // time-out if Friend Connect never calls back
		// yes, use of a time-out is silly here, but since this is only an experiment,
		// it provides sufficient error handling ;)
		// [more thorough error handling could be the focus of an entire other experiment]
		</script> 
		{% endif %}
{% endblock %}
